
<include file="mobile/Public/header" />

<link rel="stylesheet" href="__CSS__/good.css">
<style>
    .orderlist-section{background: white;border-top: thin solid #e2e2e2}
    .orderlist-section li{padding: 1rem 0;width: 3rem}
    .btn-group button{border: none;border-radius: 3px;padding: 8px;}

    .load-more{text-align: center} 
    .big-text{font-size: 1.3rem}
</style>
<header class="color-main vertical-box">
    <span class="header-title">一键找布历史</span>
    <div class="header-left vertical-box">
        <img class="img-btn" src="__IMG__/back.png" onclick="history.back()">
    </div>
    <div class="header-right vertical-box">
        <img class="img-btn" src="__IMG__/home.png" onclick="window.location.href='{:U('shop/index/index')}'">
    </div> 
</header>
<article class="orders-article">
    <section class="orderlist-section margin-bottom">
        <div class="display-table">
            <ul>
                <li class="big-text <php> if((isset($option['status']))&&($option['status']=="0")) echo 'active-bottom'</php>" onclick="window.location.replace('{:U('shop/index/quick_order_list/')}')">全部</li>
                <li class="big-text <php> if((isset($option['status']))&&($option['status']=="1")) echo 'active-bottom'</php>" onclick="window.location.replace('{:U('shop/index/quick_order_list/',array('status'=>1))}')">待确认</li>
                <li class="big-text <php> if((isset($option['status']))&&($option['status']=="2")) echo 'active-bottom'</php>" onclick="window.location.replace('{:U('shop/index/quick_order_list/',array('status'=>2))}')">已确认</li>
                <li class="big-text <php> if((isset($option['status']))&&($option['status']=="3")) echo 'active-bottom'</php>" onclick="window.location.replace('{:U('shop/index/quick_order_list/',array('status'=>3))}')">已取消</li>
            </ul>
        </div>
    </section>
	<literal>
    <script id="order-tpl" type="text/x-dot-template">

        {{~it.list:value:index }}

        <section class="good-section linear-section" onclick="window.location.href='__ROOT__/index.php?s=shop/index/quick_order_detail&id={{=value.id}}'">
            <div class="good-section-left">
                <img class="good-section-img" src="{{=value['main_image']}}">
            </div>
            <div class="good-section-right border-box">
                <p class="good-section-title" style="overflow: hidden; text-overflow:ellipsis; white-space: nowrap; width:80%;">
                    {{=value['content']}}
                </p>
                <span class="big-text good-status-text secondary-font">采购数量：{{=value['quantity']}}米</span>

            </div>
        </section>
        
        <section class="good-info-section small-text white-tips-font" onclick="window.location.href='/index.php/?s=shop/index/quick_order_detail&id={{=value.id}}'">
            <div class="good-right-div clearfix">
                <span class="normal-text good-status-text">{{= shopStatusExchange(value.status)}}</span>
                <span>{{=value['create_time']}}</span>
            </div>
        </section>

        <section class="good-info-section small-text white-tips-font last-liner-section margin-bottom">
            <div class="good-right-div btn-group">

            {{? value['status']==1 }}
                <button data-id="{{=value['id']}}" class=".cancel-order-btn color-disable">取消</button>
            {{?}}
            </div>
        </section>
        {{~}}
    </script>
	</literal>
    <p class="load-more">加载中...</p>
</article>

<include file="mobile/Public/footer" />


<script>
    var order_option = <php> echo(!empty($option)? json_encode($option):"null")</php>;
    //'jquery' or 'zepto' 脚本入口,按情况选择加载
    seajs.use(['jquery','doT'], function () {
        $(document).ready(function () {
            $('.orders-article').on('click','button',function () {
                var id = $(this).data('id');
                if(confirm('您确定要取消吗？')){
                    $.post('{:U('shop/index/quick_order_list/')}',{id:id}, function (ret) {
                        if(ret.status==1){
                            alert('取消成功！');
                            window.location.reload();
                        }
                    })
                }
            });
            get_orders(0);
            function get_orders(page){

                if(!page) page=1;
                var option = {
                    status:order_option.status,
                    page:page,
                    r:10
                };

                $.post('{:U('shop/index/quick_order_list/')}',option, function (ret) {
                    console.log(ret);
                    if(ret.status==1){
                        //console.log(shopStatusExchange);
                        var orderTpl = doT.template($('#order-tpl').text());
                        $('.load-more').before(orderTpl(ret.info));
                    }
                    if(10*(page-1)+ret.info.list.length==ret.info.count){
                        $(".load-more").text("没有更多订单了").unbind()
                    }
                    else{
                        $(".load-more").text("点击加载更多");
                    }
                })
            }
        });
    });
    function shopStatusExchange(status){
        switch (status){
            case '1': return '待确认'; break;
            case '2': return '已确认'; break;
            case '3': return '已取消'; break;
        }
    }
</script>
</body>
</html>